@import './public.less';

.face-class-box {
//   position: relative;
  .picture-box {
    height: 300/75rem;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
  }
  .face-class-body {
    padding: 0 30/75rem;

    .face-card {
      position: relative;
      top: -30/75rem;
      padding: 35/75rem 35/75rem 0;
      box-shadow: 0px 2px 8px 1px rgba(153, 153, 153, 1);
      border-radius: 7px;
      background-color: #ffffff;

      .card-content {
        align-items: flex-start;
        padding-bottom: 20/75rem;
        border-bottom: 0.5px solid rgba(153, 153, 153, .2);
      }

      .card-text {
        flex: 1 0 auto;
        margin-right: 60/75rem;
        .tip {
          font-weight: bold;
          font-size: 30/75rem;
          color: rgba(1, 1, 1, 1);
        }

        .details {
          margin: 27/75rem 0;
          font-weight: 400;
          font-size: 24/75rem;
          color: rgba(0, 0, 0, 1);
        }

        .user {
          margin-bottom: 25/75rem;
          font-size: 18/75rem;
          font-weight: bold;
          color: rgba(0, 0, 0, 1);
          opacity: 0.5;
        }

        .time {
          font-size: 18/75rem;
          font-weight: 400;
          color: rgba(153, 153, 153, 1);
        }
      }

      .card-picture-box {
        .card-head-picture {
          height: 154/75rem;
          width: 154/75rem;
          border-radius: 8px;
          overflow: hidden;
          background-position: 50% 50%;
          background-size: cover;
        }

        .time {
          margin-top: 20/75rem;
          font-size: 18/75rem;
          text-align: center;
          font-weight: bold;
          color: rgba(153, 153, 153, 1);
        }
      }
    }

    .card-footer {
      justify-content: space-between;
      padding: 30/75rem 50/75rem;
      font-size: 18/75rem;
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
    }

    .class-tips {
      margin: 15/75rem 0;
      font-size: 30/75rem;
      font-weight: bold;
      color: rgba(0, 0, 0, 1);
    }

    .class-content-text {
        line-height: 44/75rem;
      font-size: 24/75rem;
      font-weight: 300;
      color: rgba(0, 0, 0, .6);
    }
    
  }
  .face-class-btn{
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    padding: 30/75rem;
}
}
